<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <script>

        // 链式操作的本质就是返回同类型的数据

        //    p.style.color    p是一个对象，style也是对象

        const str = 'hello';

        // 这些方法都返回的是字符串
        const res = str.substring(0, 3).replace('h', '*').split('');

        console.log(res);


        // 数组的链式操作

        //    concat()  返回新的数组


        //    push()     直接改变原数组，返回的数组的长度
        //    pop()      直接改变原数组，返回的被删除的数据
        //    unshift()  直接改变原数组，返回的数组的长度
        //    shift()    直接改变原数组，返回的被删除的数据

        //    splice()   直接改变原数组，返回的被删除的数据组成的数组

        //    sort()    数组的排序   直接改变原数组

        //    reverse() 数组反向     直接改变原数组

        const arr = [1, 2, 3];
        const res1 = arr.concat([4, 5, 66]).splice(0, 2);
        console.log(res1);




        // 函数的链式操作
        //     函数的参数    数字 、字符串、布尔值、数组、对象   也可以是函数   --- 回调函数
        //     函数的返回值  数字 、字符串、布尔值、数组、对象   也可以是函数

        function fn1() {
            return function (n) {
                console.log(n);
            }
        }

        // const res2 = fn1();
        // res2();
        fn1()(4);




        function fn1() {
            function fn(n) {
                console.log(n);
            }

            return fn;
        }


        // function fn1() {
        //     function fn(n) {
        //         console.log(n);
        //     }

        //     return fn();  返回的是fn这个函数的执行结果
        // }


    </script>

</body>

</html>